<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>我的购物车页</title>
    <link rel="stylesheet" href="/css/cart.css">
</head>
<body>
    <header></header>


    <div class="main">
        <div class="wrap">
            <div class="wrap-mycart">
                <div class="wrap-mycart-top">
                    <span class="shop-info">商品信息</span>
                    <span class="shop-price">单价/元</span>
                    <span class="shop-num">数量</span>
                    <span class="shop-sumprice">金额/元</span>
                    <span class="caozuo">操作</span>
                </div>


                <!-- 空购物车时显示 -->
                <div class="empty" >
                    <p>购物车空空如也，赶紧选购我们的商品吧 !&nbsp;&nbsp;<a href="/index.html">【去逛逛吧】</a></p>
                </div>

                <!-- 有物品时渲染 -->
                <div class="con">

                   
                    <div class="gys">
                        <input type="checkbox" id="allChoose"/>
                        <p>全选</p>
                    </div>
    
                    <!-- 购物车商品选择列表 -->

                    <div class="mycart-list">
                         <!-- 模板 -->

                        <script type="text/html" id="shopcart">
                            {{each cart shop}}
                            <div class="mycart-list-wrap"  data-id="{{shop.id}}"> 

                                
                                <input type="checkbox" class="choose" {{shop.check ? "checked" : ""}} />
                                <div class="mycart-list-wrap-img">
                                    <img src="{{shop.photo[0].url}}" class="imgs" alt="">
                                </div>

                                
                                <div class="mycart-list-wrap-name">
                                    <p>{{shop.title.slice(0,15)+'...'}}</p>
                                    
                                    {{if shop.couponValue}}
                                        <span>{{shop.couponValue}}</span>
                                    {{/if}}
                                </div>
                                <div class="mycart-list-wrap-size">
                                    优惠券过期:<span>{{shop.expireDate}}</span>
                                </div>
                                <div class="mycart-list-wrap-price">
                                    <span>{{shop.price}}</span>
                                </div>
        
                                <!-- 加减数量 -->
                                <div class="mycart-list-wrap-choosenum" >
                                    <span class="sub-btn">-</span>
                                    <input type="text" value="{{shop.count}}" class="cart-count">
                                    <span class="add-btn">+</span>
                                </div>
        
                                <div class="mycart-list-wrap-pricesum">
                                    <span class="mycart-list-wrap-pricesum-sp">{{(shop.price*shop.count).toFixed(2)}}</span>
                                </div>
        
                                <div class="mycart-list-wrap-caozuo">
                                    <span class="cart-del">删除</span>
                                    
                                </div>
                            </div>
                            {{/each}}
                        </script>
                    </div>
                    <!-- 购物车列表结束 -->
    
                    <!-- 购物车结算框 -->
                    <div class="wrap-mycart-settlement">
                        <a href="#">
                            去结算
                        </a>
                        <div class="wrap-mycart-settlement-info">
                            <div class="wrap-mycart-settlement-info-top">
                                已选商品<span class="yixuanshops">&nbsp;0&nbsp;</span>件&nbsp;总价:&nbsp;<span class="totalMoney">0.00元</span>
                            </div>
                            <div class="wrap-mycart-settlement-info-down">
                                <span style="float: right;">不含运费和其他优惠</span>
                            </div>
                        </div>
                    
                    </div>
                <!-- 购物车结算框结束 -->
    
                <!-- 开始为你推荐 -->
                    <div class="wrap-mycart-tuijian">
                        <h3>为你推荐</h3>
                        <ul class="wrap-mycart-tuijian-ul">
                            <!-- <li>
                                <a href=""><img src="/imgs/tuijian.jpg" alt=""></a>
                                <div class="down">
                                    <p class="title">四盟充电宝</p>
                                    <span class="down-sp1">99.00元</span> 
                                    <span class="down-sp2">129.00元</span>
                                </div>
                            </li> -->
                        </ul>
                        <script type="text/html" id="forTuijian">
                            
                            {{each list items}}
                            {{if items.title}}
                            <li>
                                <a href="/html/infopage.html?{{items.id}}"><img src="{{items.image}}" alt=""></a>
                                <div class="down">
                                    <p class="title">{{items.title.slice(0,8)+"..."}}</p>
                                    <span class="down-sp1">{{items.price}}元</span> 
                                    <span class="down-sp2">原价:&nbsp;{{items.originPrice}}元</span>
                                </div>
                            </li>
                            {{/if}}
                            {{/each}}
                        </script>
                    </div>
                </div>
                
                
                <!-- 结束为你推荐 -->
            </div>
        </div>
    </div>

    
    <footer></footer>
    <script src="/libs/require/require.min.js" data-main="/js/cart"></script>
</body>
</html>